<html><head><title>Welcome!</title>
<link rel="stylesheet" href="css/flora.tabs.css" type="text/css">
<style type="text/css">
tr.even {background-color: #dfd;}
td {text-align: center;}
</style>
<script type="text/javascript" src="jquery.pack.js"></script>
<script type="text/javascript" src="jquery.timer.js"></script>
<script type="text/javascript" src="ui.base.js"></script>
<script type="text/javascript" src="ui.tabs.js"></script>
<script type="text/javascript">
function getselected(){
    var name = $("li.ui-tabs-selected a span").html();
    var spans = $("span");
    var i;
    var selected=0;
    for (i=0;i<spans.length;i++){//can also use $().each(function(){});
        if(spans[i].innerHTML==name){selected = i;break;}
    }
    return selected;    
}
$(document).ready(function(){
    $("#container > ul").tabs();
    $("div#buddylist").load("frlist");
    $("#closebtn").click(function(){
        var selected = getselected();
        if(selected > 0){
            $("#container > ul").tabs("remove",selected);
        }
    });

    $("#sendbtn").click(function(){
        var name = $("li.ui-tabs-selected a span").html();
        var selected = getselected();
        if(selected > 0){
            var msg = $("textarea#inputbox").val();
            $.post("/"+name+".dat", {Myself: msg}, function(reply){
                $('#container > ul').tabs("load",selected);
                $("textarea#inputbox").val('');
            });
        }
    });
    $("div#buddylist").ajaxComplete(function(){
        $("tr:even").addClass("even");
        $("tr").click(function(){
            var name = $(this).children()[0].innerHTML;
            var tabs = $("span:contains('"+name+"')");
            if(tabs.length>0){return 1;}
            $("#container > ul").tabs("add","/"+name+".dat",name);
        });
    });
    $.timer(5000, function(){
        var selected = getselected();
        if(selected > 0){
            $('#container > ul').tabs("load",selected);
        }
    });
});
</script>
</head>
<body>
<div id="container" class="flora">
<ul>
<li><a href="#buddylist"><span>Buddy list</span></a></li>
</ul>
<div id="buddylist"></div>
</div>
<textarea id="inputbox" rows="2" cols="40"></textarea><button id="sendbtn">Send</button>
<button id="closebtn">Close</button>
<hr>
<button id="cfgbtn" onClick="window.open('config.htm')">Config</button><button id="helpbtn" onClick="window.open('help.htm')">Help</button>
</body></html>